import React from 'react';
import { Row, Col, Button } from 'antd';
import { history } from 'umi';
export default (props) => {
  const { list, form } = props;
  const handleForm = (item) => {
    let data = form.getFieldValue('tags') || [];
    if (data.includes(item)) {
      form.setFieldValue(
        'tags',
        data.filter((val) => {
          return item !== val;
        }),
      );
    } else {
      form.setFieldValue('tags', [...data, item]);
    }
  };
  if (list.length !== 0) {
    return (
      <Row>
        <Col style={{ textAlign: 'right', paddingRight: 8 }} span={6}>
          分类标签:
        </Col>
        <Col>
          {list.map((item, index) => {
            return (
              <Button
                onClick={() => {
                  handleForm(item.show_name);
                }}
                style={{
                  padding: 0,
                  paddingRight: 4,
                  lineHeight: 1,
                  height: 'auto',
                  marginBottom: 12,
                }}
                key={index}
                type="link"
              >
                {item.show_name}
              </Button>
            );
          })}
        </Col>
      </Row>
    );
  } else {
    return null;
  }
};
